<div id="content">
  <div class="row s_page_title">
    <sa-big-breadcrumbs [items]="['设备安装管理', '安装管理[个人]', '维修记录']" icon="fa fa-wrench"
      class="col-xs-12 col-sm-7 col-md-7 col-lg-4"></sa-big-breadcrumbs>
  </div>

  <sa-widgets-grid>
    <div class="s_table">
      <div sa-widget [editbutton]="false" color="darken" class="clearfix">
        <header>
          <span class="widget-icon"><i class="fa fa-table"></i></span>
          <h2>维修记录</h2>
        </header>
        <div>
          <div class="widget-body no-padding">
            <div class="page-header clearfix s_table_opreation">
              <div class="left page-header-btn" style="width: calc(100% - 220px)">
                <div class="top_module">
                  <span class="module_text">车牌号码</span>
                  <sa-select2 select2ElementID="carSelect2" (optionSelected)="companySelected($event)"
                    matchSearch="true"></sa-select2>
                </div>
                <!-- <sa-company-tree-car companyTreeId="companyTree" [companyData]="companyData"  (companySelected)="companySelected($event)"></sa-company-tree-car> -->

                <!-- <div class="top_module">
									<span class="module_text">用户名</span>
									<div class="s_hover_box">
										<select   class="select2"  id="userNameSelect2" style="width: 150px;">
											<option value=''></option>
										</select>
										<div class="s_del_icon" (click)='delUserName()'>x</div>
									</div>
								</div> -->
                <!-- <div class="top_module top_module_box" style="min-width: auto;">
									<span class="top_module_label module_text">进厂限制</span>
									<select name="" class="top_module_select" [(ngModel)]="isPush" style="min-width: 110px;">
										<option value="">全部</option>
										<option value="1">限制</option>
										<option value="0">不限制</option>
									</select>
								</div> -->
                <div class="top_module top_module_box" style="min-width: auto">
                  <span class="top_module_label module_text">故障现象</span>
                  <select name="" class="top_module_select" [(ngModel)]="faultPhenomenon" style="min-width: 110px">
                    <option value="">全部</option>
                    <option value="GPS问题">GPS问题</option>
                    <option value="传感器问题">传感器问题</option>
                    <option value="离线问题">离线问题</option>
                    <option value="甩挂问题">甩挂问题</option>
                  </select>
                </div>

                <div class="top_module top_module_box" style="min-width: auto">
                  <span class="top_module_label module_text">维修内容</span>
                  <select name="" class="top_module_select" [(ngModel)]="repairContent" style="min-width: 110px">
                    <option value="">全部</option>
                    <option value="更换主机">更换主机</option>
                    <option value="更换线材">更换线材</option>
                    <option value="更换天线">更换天线</option>
                    <option value="更换传感器">更换传感器</option>
                    <option value="电源维修">电源维修</option>
                    <option value="重新焊接">重新焊接</option>
                    <option value="挪动天线位置">挪动天线位置</option>
                    <option value="离线其他">离线其他</option>
                    <option value="GPS其他">GPS其他</option>
                    <option value="传感器其他">传感器其他</option>
                    <option value="V4换V7">V4换V7</option>
                    <option value="无维修">无维修</option>
                  </select>
                </div>
                <!-- <div class="top_module top_module_box" style="min-width: auto;">
									<span class="top_module_label module_text">时间类型</span>
									<select name="" class="top_module_select" [(ngModel)]="dateType" style="min-width: 110px;">
										<option value="">全部</option>
										<option value="1">创建时间</option>
										<option value="2">维修时间</option>
									</select>
								</div> -->
                <div class="top_module top_module_box" style="min-width: auto">
                  <span class="top_module_label module_text">维修时间排序</span>
                  <select name="" class="top_module_select" [(ngModel)]="sortType" style="min-width: 110px">
                    <option value="1">升序</option>
                    <option value="2">降序</option>
                  </select>
                </div>
                <div class="selectDate top_module">
                  <div class="input-daterange input-group s_selected_time_box s_hover_box">
                    <input type="text" [(ngModel)]="startTime" class="form-control s_selected_time" id="datetimepicker3"
                      autocomplete="off" placeholder="选择开始时间" />
                    <span class="s_selected_time_spe">至</span>
                    <input type="text" [(ngModel)]="endTime" class="form-control s_selected_time" id="datetimepicker4"
                      autocomplete="off" placeholder="选择结束时间" />
                    <div class="s_del_icon" (click)="del_date()">x</div>
                  </div>
                </div>
                <button class="btn btn-primary" (click)="table_search()">查询</button>
                <!-- <button  type="button"  class="btn btn-primary" (click)="new_fault()" *ngIf="resourceAdd">添加</button>
								<button type="button" class="btn btn-primary" (click)="carWaitingRepairTop(waitingRepairModal)">车辆排名</button> -->
                <button type="button" class="btn btn-primary" (click)="exportData()">导出</button>
                <!-- <button type="button" class="btn btn-primary" (click)="openRepairedRecord(repairedRecordModal)">维修记录</button>
								<button type="button" class="btn btn-primary" (click)="questionSort(questionSortModal)">故障分类</button>
								<button  type="button" class="btn btn-primary" (click)="updata_device(lgModal)">批量进厂限制</button>
								<button type="button" class="btn btn-primary s_btn_fix" (click)="setFactoryOnline(factoryOnlineModal)">进厂限制设置</button>
								<button type="button" class="btn btn-primary s_btn_fix" (click)="addRecordDetail(recordDetailModal)">新增不良记录</button>-->
              </div>
              <div class="right top-search">
                <input type="text" [(ngModel)]="searchKey" (change)="table_search()" class="search-input"
                  placeholder="车牌号码、 所属公司..." />
                <span class="top-search-box">
                  <button class="top-search-btn" type="button" (click)="table_search()">
                    <i class="fa fa-search"></i>
                  </button>
                </span>
              </div>
            </div>
            <div class="table_scroll">
              <table
                class="display dataTables responsive table table-striped table-bordered table-hover dataTable s_h5_table">
                <thead>
                  <tr>
                    <th>操作</th>
                    <th>设备ID</th>
                    <th>车牌号码</th>
                    <th>用途分类</th>
                    <th>公司名称</th>
                    <th>维修人员</th>
                    <th>维修订单创建时间</th>
                    <th>维修时间</th>
                    <th>故障现象</th>
                    <th>维修内容</th>
                    <th>维修细分</th>
                    <th>维修编号</th>
                    <th>维修费用[元]</th>
                    <th>支付状态</th>
                    <th>维修状态</th>
                    <th>是否审核</th>
                    <th>审核人员</th>
                    <th>审核时间</th>
                    <th>审核意见</th>
                  </tr>
                </thead>
                <tbody>
                  <tr *ngFor="let row of tableData; let i = index" [attr.data-index]="i">
                    <td>
                      <button type="button" (click)="open_img(row, ImgModal)">图片</button>
                      <!-- <button type="button" (click)="audit_Record(row,auditModal)" *ngIf="auditCheck">审核</button> -->
                    </td>
                    <td>{{ row.deviceId }}</td>
                    <td>{{ row.carNumber }}</td>
                    <td>{{ row.useTypeL2 }}</td>
                    <td>{{ row.companyName }}</td>
                    <td>{{ row.repairedUserName }}</td>
                    <td>{{ row.repairOrderCreateTime }}</td>
                    <td>{{ row.repairedTime }}</td>
                    <td>{{ row.faultPhenomenonList }}</td>
                    <td>{{ row.repairContentList }}</td>
                    <td>{{ row.repairSubdivideList }}</td>
                    <td>{{ row.repairedNumber }}</td>

                    <td>
                      <span *ngIf="row.payWay == 0" style="
                          padding: 4px;
                          border-radius: 2px;
                          background-color: #4cae4c;
                          color: white;
                          font-size: 12px;
                        ">
                        个人
                      </span>
                      <span *ngIf="row.payWay == 1" style="
                          padding: 4px;
                          border-radius: 2px;
                          background-color: #1a6ddd;
                          color: white;
                          font-size: 12px;
                        ">
                        对公
                      </span>
                      <span style="padding: 0 5px">{{ row.price / 100 }}</span>
                      <button type="button" *ngIf="row.price" (click)="repairedMonkey(repairedMonkeyModal, row)">
                        查看
                      </button>
                    </td>
                    <td>
                      <span *ngIf="row.payStatus == 1" class="orange">待支付</span>
                      <span *ngIf="row.payStatus == 2" class="green">已支付</span>
                      <span *ngIf="row.payStatus == 3" class="grey">订单取消</span>
                      <span *ngIf="row.payStatus == 4" class="green">已完成</span>
                    </td>
                    <td>
                      <span class="green">已维修</span>
                    </td>
                    <td>
                      <span *ngIf="row.auditStatus === 0" class="orange">未审核</span>
                      <span *ngIf="row.auditStatus === 1" class="green">审核通过</span>
                      <span *ngIf="row.auditStatus === 2" class="red">审核不通过</span>
                    </td>
                    <td>{{ row.auditUser }}</td>
                    <td>{{ row.auditDate }}</td>
                    <td>{{ row.describe }}</td>
                  </tr>
                </tbody>
              </table>
            </div>
            <div class="table-fix clearfix">
              <paginator [totalRecords]="totalCount" [rows]="pageSize" [currentPage]="curPage - 1"
                (onPageChange)="paginate($event)"></paginator>
              <button type="button" class="btn default refresh_btn" (click)="refresh()">
                <i class="fa fa-refresh"></i>
              </button>
            </div>
          </div>
        </div>
      </div>
    </div>
  </sa-widgets-grid>
  <!-- 待维修车辆TOP20   弹窗-->
  <section bsModal #waitingRepairModal="bs-modal" class="modal fade" tabindex="-1" role="dialog"
    aria-labelledby="myLargeModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg" style="width: 780px">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" (click)="waitingRepairClose(waitingRepairModal)" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
          <h4 class="modal-title">
            车辆故障TOP{{ topNumber }}
            <div class="btn_ground" style="min-width: 160px; float: right; margin-right: 60px">
              <button class="btn_color" [ngClass]="{ active: curBtn === '1' }" (click)="topDateSelect('1')">
                今天
              </button>
              <button class="btn_color" [ngClass]="{ active: curBtn === '2' }" (click)="topDateSelect('2')">
                近一周
              </button>
              <button class="btn_color" [ngClass]="{ active: curBtn === '3' }" (click)="topDateSelect('3')">
                当月
              </button>
            </div>
            <div class="page-header page-header-btn" style="float: right; margin: 0; padding: 0; border: none">
              <div class="top_module top_module_box right" style="margin: 0">
                <span class="top_module_label module_text">TOP{{ topNumber }}排名</span>
                <select name="" class="top_module_select" [(ngModel)]="topNumber" (change)="topNumberChange()"
                  style="min-width: 32px">
                  <option value="10">10</option>
                  <option value="20">20</option>
                  <option value="30">30</option>
                  <option value="40">40</option>
                  <option value="50">50</option>
                </select>
              </div>
            </div>
          </h4>
        </div>
        <div class="modal-body">
          <div class="row form-horizontal">
            <div style="border: 1px solid #ddd; border-radius: 4px; padding: 12px"
              *ngIf="selectedCompanyName || userName || faultTypeName || searchKey || startTime || endTime">
              <ul class="row">
                <li style="font-size: 14px; font-weight: bold; margin-bottom: 4px">筛选条件</li>
                <li class="col-sm-4" *ngIf="selectedCompanyName">
                  <span>公司名称：</span>
                  <span>{{ selectedCompanyName }}</span>
                </li>
                <li class="col-sm-4" *ngIf="userName">
                  <span>用户名：</span>
                  <span>{{ userName }}</span>
                </li>
                <li class="col-sm-4" *ngIf="faultTypeName">
                  <span>故障类型：</span>
                  <span>{{ faultTypeName }}</span>
                </li>
                <li class="col-sm-4" *ngIf="startTime">
                  <span>开始时间：</span>
                  <span>{{ startTime }}</span>
                </li>
                <li class="col-sm-4" *ngIf="endTime">
                  <span>结束时间：</span>
                  <span>{{ endTime }}</span>
                </li>
                <li class="col-sm-4" *ngIf="searchKey">
                  <span>关键字：</span>
                  <span>{{ searchKey }}</span>
                </li>
                <li class="col-sm-4" *ngIf="topNumber">
                  <span>top排名：</span>
                  <span>前{{ topNumber }}名</span>
                </li>
              </ul>
            </div>
            <table *ngIf="waitingRepairCarTopList.length > 0"
              class="display dataTables responsive table table-striped table-bordered table-hover dataTable s_h5_table">
              <tr>
                <th>排名</th>
                <th>车牌号码</th>
                <th>问题[个]</th>
              </tr>
              <tr *ngFor="let item of waitingRepairCarTopList; let i = index">
                <td>{{ i + 1 }}</td>
                <td>{{ item.text }}</td>
                <td>{{ item.value }}</td>
              </tr>
            </table>
            <div class="note" *ngIf="waitingRepairCarTopList.length == 0">暂无数据</div>
          </div>
        </div>
      </div>
    </div>
  </section>
  <!-- 待维修车辆TOP20 end-->
  <!-- 图片查看   弹窗-->
  <section bsModal #ImgModal="bs-modal" class="modal fade" tabindex="-1" role="dialog"
    aria-labelledby="myLargeModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg" style="width: 800px">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" (click)="imgClose(ImgModal)" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
          <h4 class="modal-title">图片查看</h4>
        </div>
        <div class="modal-body">
          <div class="row form-horizontal">
            <div class="form-group col-xs-12 imagesInfo">
              <div class="col-xs-6 imgContList">
                <p class="imgTit">维修前</p>
                <div class="col-xs-12 imgViewMain">
                  <div class="col-xs-12 imgViewCont" *ngFor="let row of beforeImageInfo">
                    <div class="col-xs-3 imgViewTit">
                      <span>{{ row.name }}</span>
                    </div>
                    <div class="col-xs-9 imgViewList">
                      <img class="imgViewShow" *ngFor="let item of row.imageUrl" [src]="item" [alt]="row.name"
                        (click)="bigimg()" />
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-xs-6 imgContList">
                <p class="imgTit">维修后</p>
                <div class="col-xs-12 imgViewMain">
                  <div class="col-xs-12 imgViewCont" *ngFor="let row of afterImageInfo">
                    <div class="col-xs-3 imgViewTit">
                      <span>{{ row.name }}</span>
                    </div>
                    <div class="col-xs-9 imgViewList">
                      <img class="imgViewShow" *ngFor="let item of row.imageUrl" [src]="item" [alt]="row.name"
                        (click)="bigimg()" />
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>
  <!-- 图片查看 弹窗end-->

  <!--折线图-->
  <div style="background: white; border-radius: 5px; margin-top: 5px; position: relative" [hidden]="!isChartView">
    <button (click)="closeChart()" class="div_closeBtn">×</button>
    <div class="widget-body no-padding" style="margin: 0">
      <div class="page-header clearfix s_table_opreation" style="margin: 0">
        <div class="left page-header-btn" style="padding: 5px">
          <div class="top_module">
            <span class="module_text" style="background: none">异常数据折线图</span>
          </div>
          <div style="display: inline-block">
            <div>
              <div class="selectDate top_module">
                <table-select-date [notInit]="true" [specifyTime]="specifyTime"
                  (outerTime)="getSelectChartTime($event)"></table-select-date>
              </div>
              <button type="button" class="btn btn-primary" (click)="drawAbnormalChart()">查看</button>
            </div>
          </div>
        </div>
      </div>
    </div>

    <sa-chart-bmap [height]="325" [offDatas]="true" [inputParams]="selectedRow" [isBaiduMap]="true"
      (outerSend)="runParent($event)" (outerIsMap)="showMapView($event)" [isAuditData]="false"
      [isShowModify]="false"></sa-chart-bmap>
    <div [hidden]="!isMapView">
      <sa-bmap-chart [trackParams]="drawTrackArr" [isShowBmap]="isMapView" deviceId="deviceId"></sa-bmap-chart>
    </div>
  </div>
  <!--折线图end-->

  <!-- 问题车辆分类  弹窗-->
  <section bsModal #questionSortModal="bs-modal" class="modal" tabindex="-1" role="dialog"
    aria-labelledby="myLargeModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg" style="width: 860px">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" (click)="closeQuestionSort(questionSortModal)" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
          <h4 class="modal-title">故障分类</h4>
        </div>
        <div class="modal-body">
          <div class="row form-horizontal">
            <div class="tabbable">
              <ul class="nav nav-tabs" id="myTab"
                style="padding-left: 12px; background-image: linear-gradient(#f1f5fd, #e9f0ff)">
                <li class="active s-lis">
                  <a data-toggle="tab" href="#repaired">
                    故障统计
                    <span id="allOrders" style=""></span>
                  </a>
                </li>
                <li class="s-lis">
                  <a data-toggle="tab" href="#question">
                    故障分类统计
                    <span id="transOrders" class="status-blue"></span>
                  </a>
                </li>
              </ul>
              <div class="tab-content" style="padding: 0; border: none">
                <div id="repaired" class="tab-pane active">
                  <div style="border: 1px solid #ddd; border-radius: 4px; padding: 12px; margin-top: 6px" *ngIf="
                      selectedCompanyName ||
                      carNumber ||
                      userName ||
                      faultTypeName ||
                      isPush ||
                      searchKey ||
                      startTime ||
                      endTime ||
                      dateType
                    ">
                    <ul class="row">
                      <li style="font-size: 14px; font-weight: bold; margin-bottom: 4px">筛选条件</li>
                      <li class="col-sm-4" *ngIf="selectedCompanyName">
                        <span>公司名称：</span>
                        <span>{{ selectedCompanyName }}</span>
                      </li>
                      <li class="col-sm-4" *ngIf="carNumber">
                        <span>车牌号码：</span>
                        <span>{{ carNumber }}</span>
                      </li>
                      <li class="col-sm-4" *ngIf="userName">
                        <span>用户名：</span>
                        <span>{{ userName }}</span>
                      </li>
                      <li class="col-sm-4" *ngIf="faultTypeName">
                        <span>故障类型：</span>
                        <span>{{ faultTypeName }}</span>
                      </li>
                      <li class="col-sm-4" *ngIf="isPush">
                        <span>进厂限制：</span>
                        <span *ngIf="isPush == 0">限制</span>
                        <span *ngIf="isPush == 1">不限制</span>
                      </li>
                      <li class="col-sm-4" *ngIf="dateType">
                        <span>时间类型：</span>
                        <span *ngIf="dateType == 1">创建时间</span>
                        <span *ngIf="dateType == 2">维修时间</span>
                      </li>
                      <li class="col-sm-4" *ngIf="startTime">
                        <span>开始时间：</span>
                        <span>{{ startTime }}</span>
                      </li>
                      <li class="col-sm-4" *ngIf="endTime">
                        <span>结束时间：</span>
                        <span>{{ endTime }}</span>
                      </li>
                      <li class="col-sm-4" *ngIf="searchKey">
                        <span>关键字：</span>
                        <span>{{ searchKey }}</span>
                      </li>
                    </ul>
                  </div>
                  <table
                    class="display dataTables responsive table table-striped table-bordered table-hover dataTable s_h5_table">
                    <tr>
                      <th>名称</th>
                      <th *ngFor="let item of dataRepaireTotalList">{{ item.name }}</th>
                    </tr>
                    <tr>
                      <td>数值</td>
                      <td *ngFor="let item of dataRepaireTotalList">{{ item.value }}</td>
                    </tr>
                  </table>
                  <div id="repairedPieChart" style="width: 818px; height: 400px"></div>
                </div>
                <div id="question" class="tab-pane">
                  <div style="border: 1px solid #ddd; border-radius: 4px; padding: 12px; margin-top: 6px" *ngIf="
                      selectedCompanyName ||
                      carNumber ||
                      userName ||
                      faultTypeName ||
                      isPush ||
                      searchKey ||
                      startTime ||
                      endTime ||
                      dateType
                    ">
                    <ul class="row">
                      <li style="font-size: 14px; font-weight: bold; margin-bottom: 4px">筛选条件</li>
                      <li class="col-sm-4" *ngIf="selectedCompanyName">
                        <span>公司名称：</span>
                        <span>{{ selectedCompanyName }}</span>
                      </li>
                      <li class="col-sm-4" *ngIf="carNumber">
                        <span>车牌号码：</span>
                        <span>{{ carNumber }}</span>
                      </li>
                      <li class="col-sm-4" *ngIf="userName">
                        <span>用户名：</span>
                        <span>{{ userName }}</span>
                      </li>
                      <li class="col-sm-4" *ngIf="faultTypeName">
                        <span>故障类型：</span>
                        <span>{{ faultTypeName }}</span>
                      </li>
                      <li class="col-sm-4" *ngIf="isPush">
                        <span>进厂限制：</span>
                        <span *ngIf="isPush == 0">不限制</span>
                        <span *ngIf="isPush == 1">限制</span>
                      </li>
                      <li class="col-sm-4" *ngIf="dateType">
                        <span>时间类型：</span>
                        <span *ngIf="dateType == 1">创建时间</span>
                        <span *ngIf="dateType == 2">维修时间</span>
                      </li>
                      <li class="col-sm-4" *ngIf="startTime">
                        <span>开始时间：</span>
                        <span>{{ startTime }}</span>
                      </li>
                      <li class="col-sm-4" *ngIf="endTime">
                        <span>结束时间：</span>
                        <span>{{ endTime }}</span>
                      </li>
                      <li class="col-sm-4" *ngIf="searchKey">
                        <span>关键字：</span>
                        <span>{{ searchKey }}</span>
                      </li>
                    </ul>
                  </div>
                  <table
                    class="display dataTables responsive table table-striped table-bordered table-hover dataTable s_h5_table">
                    <tr>
                      <th>问题点</th>
                      <th *ngFor="let item of dataAbnormalCarTotalList">{{ item.name }}</th>
                    </tr>
                    <tr>
                      <td>次数</td>
                      <td *ngFor="let item of dataAbnormalCarTotalList">{{ item.value }}</td>
                    </tr>
                  </table>
                  <div id="questionPieChart" style="width: 818px; height: 400px"></div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>
  <!-- 问题车辆分类end-->

  <!--  批量进厂限制-->
  <div bsModal #lgModal="bs-modal" id="lgModal" class="modal fade" tabindex="-1" role="dialog"
    aria-labelledby="myLargeModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" (click)="lgModalhide(lgModal)" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
          <h4 class="modal-title">批量进厂限制</h4>
        </div>
        <div class="modal-body">
          <div class="row">
            <form class="form" role="form">
              <div class="row" style="margin-bottom: 10px">
                <div class="form-group">
                  <label class="control-label">是否批量进厂限制：</label>
                  <div class="inline_block">
                    <label class="radio radio-inline" style="vertical-align: inherit">
                      <input type="radio" class="radiobox" name="0" value="0" [(ngModel)]="lgisPush" />
                      <span>不限制</span>
                    </label>
                    <label class="radio radio-inline" style="vertical-align: inherit">
                      <input type="radio" class="radiobox" name="1" value="1" [(ngModel)]="lgisPush" />
                      <span>限制</span>
                    </label>
                    <label class="radio radio-inline" style="vertical-align: inherit">
                      <input type="radio" class="radiobox" name="time" value="time" [(ngModel)]="lgisPush" />
                      <span>
                        自定义限制[
                        <span *ngIf="isPushTime == 6">默认</span>
                        <span>{{ isPushTime }}</span>
                        小时后进行限制]
                      </span>
                    </label>
                    <input type="number" *ngIf="lgisPush == 'time'" οnkeyup="value=value.replace(/[^\d]/g,'')"
                      (change)="inputChange()" name="isPushTime" placeholder="默认6小时" [(ngModel)]="isPushTime"
                      style="width: 84px; padding: 0 12px" />
                  </div>
                </div>

                <!--<div class="form-group" *ngIf="lgisPush == '0'">
                                    <label class="control-label">是否下次进厂限制：</label>
                                    <div class="inline_block">
                                        <label class="radio radio-inline" style="vertical-align:inherit;">
                                            <input type="radio" class="radiobox" name="6" value="6" [(ngModel)]="isPushTime" (change)="resetChange($event.target.checked,'Y')">
                                            <span>限制[默认6小时后进行限制]</span>
                                        </label>
                                        <label class="radio radio-inline"  style="vertical-align:inherit;">
                                            <input type="radio" class="radiobox" name="style-0a" value="" [(ngModel)]="isPushTime" (change)="resetChange($event.target.checked,'N')">
                                            <span>不限制</span>
                                        </label>
                                    </div>
                                </div>-->
              </div>
            </form>
          </div>
        </div>
        <div style="width: 60%; display: inline-block; position: absolute; bottom: 16px; left: 12px">
          <p style="color: #ccc">
            <span>【说明】</span>
            <span>自定义限制：设置时间[小时]后，车辆进厂限制生效，没有生效之前车辆允许进厂。</span>
          </p>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" (click)="lgModalhide(lgModal)">取消</button>
          <button type="button" class="btn btn-primary" (click)="autoReset(lgModal)">确认</button>
        </div>
      </div>
    </div>
  </div>
  <!--弹窗end-->

  <!--  极光推送APP-->
  <div bsModal #pushEditModal="bs-modal" id="pushEditModal" class="modal fade" tabindex="-1" role="dialog"
    aria-labelledby="myLargeModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" (click)="pushEditModalhide(pushEditModal)" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
          <h4 class="modal-title">推送APP</h4>
        </div>
        <div class="modal-body">
          <div class="row">
            <form class="form form-inline" role="form">
              <div class="row">
                <div class="form-group clearfix" style="width: 100%">
                  <label class="control-label col-sm-3 no-padding-right" style="line-height: 30px">推送人</label>
                  <div class="col-sm-8 inline_block s_hover_box">
                    <select class="select2" id="pushUserNameSelect2" style="width: 90%">
                      <option value=""></option>
                    </select>
                    <div class="s_del_icon" (click)="delPushUserName()" style="right: 15%">x</div>
                  </div>
                </div>
                <p style="margin-top: 20px">提示：如果没选择推送人，将默认推送给该维修点的负责人</p>
              </div>
            </form>
          </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" (click)="pushEditModalhide(pushEditModal)">取消</button>
          <button type="button" class="btn btn-primary" (click)="pushEditReset(pushEditModal)">确认</button>
        </div>
      </div>
    </div>
  </div>
  <!--弹窗end-->

  <!-- 进厂限制设置 -->
  <div bsModal #factoryOnlineModal="bs-modal" id="factoryOnlineModal" class="modal fade" tabindex="-1" role="dialog"
    aria-labelledby="myLargeModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg" style="width: 1000px">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" (click)="cancelFactoryOnline(factoryOnlineModal)" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
          <h4 class="modal-title">取消进厂限制</h4>
        </div>
        <div class="modal-body" style="padding: 15px">
          <div class="page-header clearfix s_table_opreation"
            style="margin-top: 0px; margin-bottom: 15px; padding-bottom: 15px">
            <div class="left page-header-btn">
              <div class="top_module">
                <span class="module_text">选择厂区</span>
                <sa-company-tree companyTreeId="company4" (companySelected)="onlinecompanySelected($event)"
                  [companyParentList]="companyParentList"></sa-company-tree>
              </div>

              <button type="button" class="btn btn-primary" (click)="factory_table_search()">查询</button>
              <button type="button" class="btn btn-primary" (click)="factoryAdd(addFactoryModal, 'new')">添加</button>
            </div>
            <div class="right top-search">
              <input type="text" id="factoryOnlineSearch" [(ngModel)]="factoryOnlineSearchKey"
                (change)="factory_table_search()" class="search-input" placeholder="公司名称" />
              <span class="top-search-box">
                <button class="top-search-btn" type="button" (click)="factory_table_search()">
                  <i class="fa fa-search"></i>
                </button>
              </span>
            </div>
          </div>
          <div class="table_scroll">
            <table
              class="display dataTables responsive table table-striped table-bordered table-hover dataTable s_h5_table">
              <thead>
                <tr>
                  <th>公司名称</th>
                  <th>进厂限制[维修记录]</th>
                  <th>进厂限制[设备警报]</th>
                  <th>时间段</th>
                  <th>操作人</th>
                  <th>操作时间</th>
                  <th>操作</th>
                </tr>
              </thead>
              <tbody>
                <tr *ngFor="let row of factoryOnlineTableData; let i = index" [attr.data-index]="i"
                  [ngClass]="{ selected: row.isChecked }">
                  <td>{{ row.companyName }}</td>
                  <td>
                    <span *ngIf="row.isRepaired === 0">进厂限制</span>
                    <span *ngIf="row.isRepaired === 1">取消限制</span>
                    <!-- {{row.isRepaired}} -->
                  </td>
                  <td>
                    <span *ngIf="row.isAlarm === 0">进厂限制</span>
                    <span *ngIf="row.isAlarm === 1">取消限制</span>
                    <!-- {{row.isAlarm}} -->
                  </td>
                  <td>{{ row.periodTime }}</td>
                  <td>{{ row.operator }}</td>
                  <td>{{ row.operatingTime }}</td>
                  <td>
                    <button type="button" (click)="editFactory(row, addFactoryModal, 'update')">编辑</button>
                    <button type="button" (click)="delFactory(row)">删除</button>
                  </td>
                </tr>
              </tbody>
            </table>
          </div>
          <div class="table-fix clearfix">
            <paginator [totalRecords]="factoryOnlinetotalCount" [rows]="factoryOnlinePageSize"
              [currentPage]="factoryOnlineCurPage - 1" (onPageChange)="factoryPaginate($event)"></paginator>
            <button type="button" class="btn default refresh_btn" (click)="factoryTableRefresh()">
              <i class="fa fa-refresh"></i>
            </button>
          </div>
          <div class="shuoming" style="position: relative">
            <div style="width: 50%; display: inline-block">
              <p><span style="color: red">说明：</span></p>
              <p style="padding-left: 25px">1、根据配置的时间段，数据API接口取消厂限制;</p>
              <p style="padding-left: 25px">2、维修记录：取消维修记录的进厂限制;</p>
              <p style="padding-left: 25px">3、设备警报：取消离线警报的进厂限制（设备离线的状态不会更改）</p>
            </div>
            <div style="display: inline-block; width: 40%; margin-left: 20px; position: absolute; top: 0">
              <p><span style="color: red">添加规则：</span></p>
              <p style="padding-left: 30px">1、每个厂区只能保存一条记录；</p>
              <p style="padding-left: 30px">2、父厂区添加后，子厂区不能再添加；</p>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <!-- 进厂限制设置 end-->
  <!-- 添加和编辑厂区 -->
  <section bsModal #addFactoryModal="bs-modal" class="modal fade" tabindex="-1" role="dialog"
    aria-labelledby="myLargeModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg" id="addFactoryModal">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" (click)="closeFactory(addFactoryModal)" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
          <h4 *ngIf="fromType == 'new'" class="modal-title">添加-取消进厂限制</h4>
          <h4 *ngIf="fromType == 'update'" class="modal-title">编辑-取消进厂限制</h4>
        </div>
        <div class="modal-body">
          <form id="setFactoryFrom" class="form-horizontal" role="form" novalidate="novalidate"
            [saBootstrapValidator]="factoryvalidatorOptions">
            <div class="row form-horizontal">
              <div class="form-group clearfix">
                <label class="control-label col-sm-4 no-padding-right">
                  公司名称：
                  <sup>*</sup>
                </label>
                <div class="col-sm-8" (click)="onclickSelectCompany()">
                  <input class="form-control" *ngIf="fromType == 'update'" name="selectCompanyName" disabled
                    [(ngModel)]="factory.companyName" id="selectCompanyName" />
                  <sa-company-tree [ngStyle]="{ display: fromType == 'new' ? 'block' : 'none' }" inputName="companyName"
                    [Height]="32" [companyNameValue]="factory.companyName" [companyIdValue]="factory.companyId"
                    companyTreeId="companyTree7" (companySelected)="factorySelected($event)"
                    [companyParentList]="companyParentList"></sa-company-tree>
                </div>
              </div>
              <div class="form-group clearfix">
                <label class="control-label col-sm-4 no-padding-right">
                  时间段：
                  <sup>*</sup>
                </label>
                <div class="col-sm-8">
                  <div class="clearfix input_lis">
                    <input class="form-control s_input" name="selfTimeInputId" type="text" onfocus="this.blur()"
                      (click)="isShowTimer()" [(ngModel)]="selfTimeInputId" id="selfTimeInput" placeholder="请选择时间段" />
                    <div class="s_del_icon" (click)="delSelfTime()">x</div>
                  </div>
                </div>
              </div>
              <div class="form-group clearfix">
                <label class="control-label col-sm-4 no-padding-right">
                  进厂限制[维修记录]：
                  <sup>*</sup>
                </label>
                <div class="col-sm-8">
                  <div class="clearfix" *ngIf="factory.isRepaired === 0">
                    <label class="col-sm-4" style="margin-bottom: 0px">
                      <input type="radio" class="radioSales" name="record" value="1" (click)="clickRecord(1)" />
                      取消限制
                    </label>
                    <label class="col-sm-4" style="margin-bottom: 0px">
                      <input type="radio" class="radioSales" name="record" value="0" (click)="clickRecord(0)" checked />
                      进厂限制
                    </label>
                  </div>
                  <div class="clearfix" *ngIf="factory.isRepaired === 1">
                    <label class="col-sm-4" style="margin-bottom: 0px">
                      <input type="radio" class="radioSales" name="record" value="1" (click)="clickRecord(1)" checked />
                      取消限制
                    </label>
                    <label class="col-sm-4" style="margin-bottom: 0px">
                      <input type="radio" class="radioSales" name="record" value="0" (click)="clickRecord(0)" />
                      进厂限制
                    </label>
                  </div>
                </div>
              </div>
              <div class="form-group clearfix">
                <label class="control-label col-sm-4 no-padding-right">
                  进厂限制[设备警报]：
                  <sup>*</sup>
                </label>
                <div class="col-sm-8">
                  <div class="clearfix" *ngIf="factory.isAlarm === 0">
                    <label class="col-sm-4" style="margin-bottom: 0px">
                      <input type="radio" class="radioSales" name="warning" value="1" (click)="clickWarning(1)" />
                      取消限制
                    </label>
                    <label class="col-sm-4" style="margin-bottom: 0px">
                      <input type="radio" class="radioSales" name="warning" value="0" (click)="clickWarning(0)"
                        checked />
                      进厂限制
                    </label>
                  </div>
                  <div class="clearfix" *ngIf="factory.isAlarm === 1">
                    <label class="col-sm-4" style="margin-bottom: 0px">
                      <input type="radio" class="radioSales" name="warning" value="1" (click)="clickWarning(1)"
                        checked />
                      取消限制
                    </label>
                    <label class="col-sm-4" style="margin-bottom: 0px">
                      <input type="radio" class="radioSales" name="warning" value="0" (click)="clickWarning(0)" />
                      进厂限制
                    </label>
                  </div>
                </div>
              </div>
              <div class="s_timePicker" id="s_timePicker">
                <div class="s_arrow"></div>
                <div class="s_start">
                  <p class="s_title">
                    开始时间
                    <span>
                      -[
                      <span style="color: #1a6ddd; font-size: 14px">{{ startTimeSelected }}</span>
                      ]
                    </span>
                  </p>
                  <div class="s_border_box">
                    <ul>
                      <li class="s_lis" *ngFor="let item of hourList" (click)="selectedTime(item.index, 'start')">
                        {{ item.index }}
                      </li>
                    </ul>
                  </div>
                </div>
                <div class="s_end">
                  <p class="s_title">
                    结束时间
                    <span>
                      -[
                      <span style="color: #1a6ddd; font-size: 14px">{{ endTimeSelected }}</span>
                      ]
                    </span>
                  </p>
                  <div class="s_border_box">
                    <ul>
                      <li class="s_lis" *ngFor="let item of hourList" (click)="selectedTime(item.index, 'end')">
                        {{ item.index }}
                      </li>
                    </ul>
                  </div>
                </div>
                <div class="s_time_footer">
                  <button class="btn btn-default" (click)="isShowTimer()" style="padding: 4px 12px; min-width: 40px">
                    取消
                  </button>
                  <button class="btn btn-primary s_btn_primary" (click)="submitTimerSelected()"
                    style="padding: 4px 12px; min-width: 40px">
                    确认
                  </button>
                </div>
              </div>
            </div>
          </form>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" (click)="closeFactory(addFactoryModal)">取消</button>
          <button type="button" *ngIf="!factory.id" class="btn btn-primary" (click)="addSubmitFactory(addFactoryModal)">
            提交
          </button>
          <button type="button" *ngIf="factory.id" class="btn btn-primary" (click)="editSubmitFactory(addFactoryModal)">
            提交
          </button>
        </div>
      </div>
    </div>
  </section>
  <!-- 添加厂区  结束 -->

  <!--    弹窗 不良记录 新增-->
  <section bsModal #recordDetailModal="bs-modal" class="modal fade" tabindex="-1" role="dialog"
    aria-labelledby="myLargeModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg" style="width: 1000px">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" (click)="recordDetailClose(recordDetailModal)" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
          <h4 class="modal-title">新增不良记录</h4>
        </div>
        <div class="modal-body" style="min-height: 240px; max-height: 560px; overflow: auto">
          <div class="row form-horizontal">
            <div class="form-group col-sm-12">
              <div class="col-sm-6 col-xs-12">
                <label class="control-label col-xs-3 no-padding-right" style="padding: 7px 0 0">寄回时间：</label>
                <div class="col-xs-9">
                  <input class="form-control" type="text" [(ngModel)]="recordDetailFrom.returnTime" name="returnTime"
                    onfocus="this.blur()" id="returnTime" autocomplete="off" placeholder="寄回时间" />
                </div>
              </div>
              <div class="col-sm-6 col-xs-12">
                <label class="control-label col-xs-3 no-padding-right" style="padding: 7px 0 0">复测结果：</label>
                <div class="col-xs-9">
                  <input class="form-control" type="text" [(ngModel)]="recordDetailFrom.retestResult"
                    name="retestResult" placeholder="复测结果" />
                </div>
              </div>
            </div>
            <div class="form-group col-sm-12">
              <div class="col-sm-6 col-xs-12">
                <label class="control-label col-xs-3 no-padding-right" style="padding: 7px 0 0">
                  车牌号：
                  <sup>*</sup>
                </label>
                <div class="col-xs-9">
                  <input class="form-control" type="text" disabled [(ngModel)]="recordDetailFrom.carNumber"
                    name="carNumber" placeholder="车牌号" />
                </div>
              </div>
              <div class="col-sm-6 col-xs-12">
                <label class="control-label col-xs-3 no-padding-right" style="padding: 7px 0 0">不良原因：</label>
                <div class="col-xs-9">
                  <input class="form-control" type="text" [(ngModel)]="recordDetailFrom.badReasons" name="badReasons"
                    placeholder="不良原因" />
                </div>
              </div>
            </div>
            <div class="form-group col-sm-12">
              <div class="col-sm-6 col-xs-12">
                <label class="control-label col-xs-3 no-padding-right" style="padding: 7px 0 0">
                  公司名称：
                  <sup>*</sup>
                </label>
                <div class="col-xs-9">
                  <input class="form-control" type="text" disabled [(ngModel)]="recordDetailFrom.companyName"
                    name="companyName" placeholder="公司名称" />
                </div>
              </div>
              <div class="col-sm-6 col-xs-12">
                <label class="control-label col-xs-3 no-padding-right" style="padding: 7px 0 0">改善策略：</label>
                <div class="col-xs-9">
                  <input class="form-control" type="text" [(ngModel)]="recordDetailFrom.improvementStrategy"
                    name="improvementStrategy" placeholder="改善策略" />
                </div>
              </div>
            </div>
            <div class="form-group col-sm-12">
              <div class="col-sm-6 col-xs-12">
                <label class="control-label col-xs-3 no-padding-right" style="padding: 7px 0 0">
                  设备Id：
                  <sup>*</sup>
                </label>
                <div class="col-xs-9">
                  <input class="form-control" type="text" disabled [(ngModel)]="recordDetailFrom.deviceId"
                    name="deviceId" placeholder="设备Id" />
                </div>
              </div>
              <div class="col-sm-6 col-xs-12">
                <label class="control-label col-xs-3 no-padding-right" style="padding: 7px 0 0">问题解决时间：</label>
                <div class="col-xs-9">
                  <input class="form-control" type="text" [(ngModel)]="recordDetailFrom.resolutionTime"
                    name="resolutionTime" placeholder="问题解决时间" />
                </div>
              </div>
            </div>
            <div class="form-group col-sm-12">
              <div class="col-sm-6 col-xs-12">
                <label class="control-label col-xs-3 no-padding-right" style="padding: 7px 0 0">
                  产品编号(外壳编码)：
                </label>
                <div class="col-xs-9">
                  <input class="form-control" type="text" [(ngModel)]="recordDetailFrom.productNo" name="productNo"
                    placeholder="产品编号(外壳编码)" />
                </div>
              </div>
              <div class="col-sm-6 col-xs-12">
                <label class="control-label col-xs-3 no-padding-right" style="padding: 7px 0 0">问题负责人：</label>
                <div class="col-xs-9">
                  <input class="form-control" type="text" [(ngModel)]="recordDetailFrom.principal" name="principal"
                    placeholder="问题负责人" />
                </div>
              </div>
            </div>
            <div class="form-group col-sm-12">
              <div class="col-sm-6 col-xs-12">
                <label class="control-label col-xs-3 no-padding-right" style="padding: 7px 0 0">硬件版本号：</label>
                <div class="col-xs-9">
                  <input class="form-control" type="text" [(ngModel)]="recordDetailFrom.hwVersion" name="hwVersion"
                    placeholder="硬件版本号" />
                </div>
              </div>
              <div class="col-sm-6 col-xs-12">
                <label class="control-label col-xs-3 no-padding-right" style="padding: 7px 0 0">
                  故障现象：
                  <sup>*</sup>
                </label>
                <div class="col-xs-9">
                  <input class="form-control" type="text" disabled [(ngModel)]="recordDetailFrom.faultPhenomenon"
                    name="faultPhenomenon" placeholder="故障现象" />
                </div>
              </div>
            </div>
            <div class="form-group col-sm-12">
              <div class="col-sm-6 col-xs-12">
                <label class="control-label col-xs-3 no-padding-right" style="padding: 7px 0 0">生产日期：</label>
                <div class="col-xs-9">
                  <input class="form-control" type="text" [(ngModel)]="recordDetailFrom.productTime" name="productTime"
                    onfocus="this.blur()" id="productTime" autocomplete="off" placeholder="生产日期" />
                </div>
              </div>
              <div class="col-sm-6 col-xs-12">
                <label class="control-label col-xs-3 no-padding-right" style="padding: 7px 0 0">关联维修记录：</label>
                <div class="col-xs-9">
                  <select class="form-control" name="type" [ngModel]="recordDetailFrom.relation" style="width: 100%"
                    disabled>
                    <option value="0">未关联</option>
                    <option value="1">已关联</option>
                  </select>
                </div>
              </div>
              <!-- <div class="col-sm-6 col-xs-12">
							<label class="control-label col-xs-3 no-padding-right" style="padding: 7px 0 0;">不良图片(多图上传)：</label>
							<div class="col-xs-9" >
								<input class="form-control" type="text"  [(ngModel)]='recordDetailFrom.imagePaths' name='imagePaths' placeholder="不良图片"/>
							</div>
						</div> -->
            </div>
            <div class="form-group col-sm-12" style="margin-bottom: 0px">
              <div class="col-sm-12 col-xs-12">
                <label class="control-label col-xs-2 no-padding-right" style="padding: 7px 0 0">
                  不良图片(多图上传)：
                </label>
                <div class="col-xs-10 imgFileList">
                  <div class="imgFileList-power">
                    <div class="imgFileList-multifile">
                      <div class="uploadlocation uploadlocation1">
                        <div class="content-list">
                          <div class="headImg" *ngFor="let item of imageInfoList; let i = index">
                            <div class="contentImg">
                              <img class="img" [src]="item" (click)="bigImgClick(ImgBigModal, item)" />
                            </div>
                            <i class="deleteImg" (click)="deleteImg(i)"></i>
                          </div>
                          <div class="btn div_imgall">
                            <div class="div_shuline"></div>
                            <div class="div_hengline"></div>
                            <input type="file" class="up" title=" " placeholder=" " accept="image/*" multiple
                              (change)="multifileChange($event.target.files)" />
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" (click)="recordDetailClose(recordDetailModal)">取消</button>
          <button type="button" class="btn btn-primary" (click)="recordDetailSubmit(recordDetailModal)">确认</button>
        </div>
      </div>
    </div>
  </section>
  <!--  弹窗end-->
  <!-- 维修费用明细 -->
  <div bsModal #repairedMonkeyModal="bs-modal" id="repairedDetailModal" class="modal fade" tabindex="-1" role="dialog"
    aria-labelledby="myLargeModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg" style="width: 1200px">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" aria-label="Close" (click)="closeRepairedMonkey(repairedMonkeyModal)">
            <span aria-hidden="true">&times;</span>
          </button>
          <h4 class="modal-title">维修费用明细</h4>
        </div>
        <div class="modal-body" style="padding: 15px">
          <div class="table_scroll">
            <h2 style="padding: 10px 0 5px 0; font-size: 16px; font-weight: bold">支付记录</h2>
            <div class="table-content">
              <div class="table-row">
                <div class="modal-div-child" style="display: flex; align-items: center; width: 20%">
                  <span class="modal-content-title">费用类型</span>
                  <span *ngIf="repairedMonkeyDetail.typeExpense === 1">安装费</span>
                  <span *ngIf="repairedMonkeyDetail.typeExpense === 2">维修费</span>
                  <span *ngIf="repairedMonkeyDetail.typeExpense === 3">服务续费</span>
                  <span *ngIf="repairedMonkeyDetail.typeExpense === 4">对接费</span>
                </div>
                <div class="modal-div-child" style="display: flex; align-items: center; width: 20%">
                  <span class="modal-content-title">所属公司</span>
                  <span>{{ repairedMonkeyDetail.companyName }}</span>
                </div>
                <div class="modal-div-child" style="display: flex; align-items: center; width: 20%">
                  <span class="modal-content-title">车牌号码</span>
                  <span>{{ repairedMonkeyDetail.carNumber }}</span>
                </div>
                <div class="modal-div-child" style="display: flex; align-items: center; width: 20%">
                  <span class="modal-content-title">设备编号</span>
                  <span>{{ repairedMonkeyDetail.deviceId }}</span>
                </div>
                <div class="modal-div-child" style="display: flex; align-items: center; width: 20%">
                  <span class="modal-content-title">总价[元]</span>
                  <span>{{ repairedMonkeyDetail.price ? repairedMonkeyDetail.price * 0.01 : 0 }}</span>
                </div>
              </div>
              <div class="table-row">
                <div class="modal-div-child" style="display: flex; align-items: center; width: 20%">
                  <span class="modal-content-title">微信用户</span>
                  <span>{{ repairedMonkeyDetail.userNickName }}</span>
                </div>
                <div class="modal-div-child" style="display: flex; align-items: center; width: 20%">
                  <span class="modal-content-title">手机号码</span>
                  <span>{{ repairedMonkeyDetail.phone }}</span>
                </div>
                <div class="modal-div-child" style="display: flex; align-items: center; width: 20%">
                  <span class="modal-content-title">支付方式</span>
                  <span *ngIf="repairedMonkeyDetail.payWay === 0">个人支付</span>
                  <span *ngIf="repairedMonkeyDetail.payWay === 1">对公转账</span>
                </div>
                <div class="modal-div-child" style="display: flex; align-items: center; width: 20%">
                  <span class="modal-content-title">支付状态</span>
                  <span *ngIf="repairedMonkeyDetail.payStatus === 1">待支付</span>
                  <span *ngIf="repairedMonkeyDetail.payStatus === 2">支付成功</span>
                  <span *ngIf="repairedMonkeyDetail.payStatus === 3">订单取消</span>
                  <span *ngIf="repairedMonkeyDetail.payStatus === 4">已完成</span>
                </div>
                <div class="modal-div-child" style="display: flex; align-items: center; width: 20%">
                  <span class="modal-content-title">支付时间</span>
                  <span>{{ repairedMonkeyDetail.payDate }}</span>
                </div>
              </div>
              <div class="table-row">
                <div class="modal-div-child" style="display: flex; align-items: center; width: 20%">
                  <span class="modal-content-title">商品名称</span>
                  <span>{{ repairedMonkeyDetail.goodsName }}</span>
                </div>
                <div class="modal-div-child" style="display: flex; align-items: center; width: 20%">
                  <span class="modal-content-title">自主支付</span>
                  <span *ngIf="repairedMonkeyDetail.isDirectPay === 0">不是</span>
                  <span *ngIf="repairedMonkeyDetail.isDirectPay === 1">是</span>
                </div>
                <div class="modal-div-child" style="display: flex; align-items: center; width: 20%">
                  <span class="modal-content-title">是否退款</span>
                  <span *ngIf="repairedMonkeyDetail.isDrawback === 0">未退款</span>
                  <span *ngIf="repairedMonkeyDetail.isDrawback === 1">退款</span>
                </div>
                <div class="modal-div-child" style="display: flex; align-items: center; width: 20%">
                  <span class="modal-content-title">创建时间</span>
                  <span>{{ repairedMonkeyDetail.createTime }}</span>
                </div>
                <div class="modal-div-child" style="display: flex; align-items: center; width: 20%">
                  <span class="modal-content-title">更新时间</span>
                  <span>{{ repairedMonkeyDetail.updateTime }}</span>
                </div>
              </div>
              <div class="table-row">
                <div class="modal-div-child" style="display: flex; align-items: center; width: 33.33%">
                  <span class="modal-content-title">平台订单号</span>
                  <span>{{ repairedMonkeyDetail.platformNumber }}</span>
                </div>
                <div class="modal-div-child" style="display: flex; align-items: center; width: 33.33%">
                  <span class="modal-content-title">商户订单号</span>
                  <span>{{ repairedMonkeyDetail.businessNumber }}</span>
                </div>
                <div class="modal-div-child" style="display: flex; align-items: center; width: 33.33%">
                  <span class="modal-content-title">支付订单号</span>
                  <span>{{ repairedMonkeyDetail.payNumber }}</span>
                </div>
              </div>
              <div class="table-row">
                <div class="modal-div-child" style="display: flex; align-items: center; width: 100%">
                  <span class="modal-content-title">备注</span>
                  <span>{{ repairedMonkeyDetail.remark }}</span>
                </div>
              </div>
            </div>
          </div>
          <div class="table_scroll">
            <h2 style="padding: 10px 0 5px 0; font-size: 16px; font-weight: bold">费用明细</h2>
            <table
              class="display dataTables responsive table table-striped table-bordered table-hover dataTable s_h5_table">
              <thead>
                <tr>
                  <th>维修内容</th>
                  <th>单价[元]</th>
                  <th>数量</th>
                  <th>总费用[元]</th>
                  <th>备注</th>
                </tr>
              </thead>
              <tbody>
                <tr *ngFor="let row of repairedMonkeyDetail.repairOrders; let i = index">
                  <td>{{ row.costDetail }}</td>
                  <td>{{ row.priceType == 1 ? row.price / 100 : row.discountPrice / 100 }}</td>
                  <td>{{ row.count }}{{ row.unit }}</td>
                  <td>{{ row.totalPrice / 100 }}</td>
                  <td>{{ row.remark }}</td>
                </tr>
              </tbody>
            </table>
          </div>
        </div>
      </div>
    </div>
    <!-- 维修费用明细 end-->
  </div>
  <style type="text/css">
    .btn_ground .active {
      color: #1a6ddd;
      font-size: 16px;
      font-weight: bold;
    }

    .btn_color {
      background-color: #fff;
      margin-right: 12px;
      height: 24px;
      line-height: 24px;
      border: none;
      min-width: 46px;
      text-decoration: underline;
    }

    .btn_color:hover {
      color: #1a6ddd;
      font-size: 16px;
      font-weight: bold;
    }

    /* 弹出层 */
    .small_img_box {
      text-align: center;
      padding: 12px 0;
    }

    .picture {
      min-height: 100px;
      width: 100%;
      height: auto;
    }

    .img_desc .arrow {
      display: inline-block;
      cursor: pointer;
      vertical-align: top;
      height: 80px;
      line-height: 80px;
      padding: 0 15px;
    }

    .img_desc .arrow.notAllow {
      cursor: not-allowed;
    }

    .small_img {
      width: 80px;
      height: 80px;
      overflow: hidden;
      display: inline-block;
      border: 2px solid #ccc;
    }

    .small_img.active {
      border: 2px solid #1a6ddd;
    }

    .small_img:hover {
      border: 2px solid #1a6ddd;
    }

    .small_img .img {
      width: 100%;
      height: auto;
    }

    .radioSales {
      margin: 8px 8px 0 0;
      /* padding-top: 29px; */
      position: relative;
      top: 1px;
    }

    /* 表头管理弹窗样式 */
    .CBtn {
      text-align: center;
    }

    .CBtn span {
      padding: 5px 8px;
      margin-right: 10px;
      font-size: 12px;
      border-radius: 5px;
      color: #fff;
      cursor: -webkit-grab;
    }

    .CBtn .MoveUp {
      color: #da3120;
      border: 1px solid #da3120;
      background: #fff;
      /* background: #da3120ba; */
    }

    .CBtn .MoveUp:hover {
      background: #da3120;
      color: #fff;
    }

    .CBtn .MoveDown {
      color: #4caf50;
      border: 1px solid #4caf50;
      background: #fff;
    }

    .CBtn .MoveDown:hover {
      background: #4caf50;
      color: #fff;
    }

    .CBtn .MoveTop {
      /* background: #ac20daba; */
      color: #ac20da;
      border: 1px solid #ac20da;
      background: #fff;
    }

    .CBtn .MoveTop:hover {
      background: #ac20da;
      color: #fff;
    }

    .CBtn .MoveBottom {
      /* background: #20afdaba; */
      color: #20afda;
      border: 1px solid #20afda;
      background: #fff;
    }

    .CBtn .MoveBottom:hover {
      background: #20afda;
      color: #fff;
    }

    .CBtn .hiddenMove {
      background: #d4d4d4 !important;
      cursor: not-allowed;
      border: 1px solid #d4d4d4 !important;
      color: #fff;
    }

    .modal-content-title {
      font-weight: bold;
      padding-right: 5px;
      border-bottom: 1px solid #ddd;
      width: 100%;
      font-size: 14px;
      box-sizing: border-box;
    }

    .modal-div-child>span {
      padding: 12px;
      display: block;
      width: 100%;
      box-sizing: border-box;
      min-height: 44px;
    }

    .modal-div-child {
      display: flex;
      flex-direction: column;
      align-items: flex-start !important;
      border-bottom: 1px solid #ddd;
      border-right: 1px solid #ddd;
      box-sizing: border-box;
    }

    .table-row {
      display: flex;
      align-items: center;
      width: 100%;
    }

    .table-row>div:last-child {
      border-right: none;
    }

    .table-content {
      border-top: 1px solid #ddd;
      border-left: 1px solid #ddd;
      border-right: 1px solid #ddd;
      box-sizing: border-box;
      background: #f9f9f9;
    }
  </style>
</div>